﻿$(function () {
    const { h, reactive, watch, ref, onMounted, resolveComponent } = Vue;
    const SideBarMenu = {
        setup(props) {
            return () => h(
                "aside",
                { class: "dashboard-sidebar" },
                [
                    h(
                        "section",
                        { class: "flex-container", style: "justify-content: flex-start; align-items: center; align-self: auto; overflow: hidden;" },
                        [
                            //头像
                            h(
                                "a",
                                {},
                                h(
                                    "section",
                                    { class: "avatar-wrapper hoverable is-round", style: "flex: 0 0 50px; width: 50px; height: 50px; margin-right: 10px; padding-bottom: 0px;" },
                                    h(
                                        "section",
                                        { class: "avatar-wrapper__img-wrapper", style: "width: 50px; height: 50px; background: rgb(255, 255, 255);" },
                                        h(
                                            "img",
                                            { src: "https://image-assets.mihuashi.com/default_avatar/employer2.jpg!avatar.normal", class: "avatar-wrapper__avatar border", style: "width: 50px; height: 50px; border-color: rgb(236, 236, 236);" }
                                        )
                                    )
                                )
                            ),
                            //名称
                            h(
                                "section",
                                { class: "flex-container is-vertical", style: "justify-content: flex-start; align-items: stretch; align-self: auto; overflow: hidden;" },
                                [
                                    h(
                                        "div",
                                        { class: "dashboard-sidebar__user-name" },
                                        [
                                            h(
                                                "span",
                                                { class: "dashboard-sidebar__role" },
                                                "企划方"
                                            ),
                                            h(
                                                "a",
                                                { class: "normal-link" },
                                                " capullos "
                                            )
                                        ]
                                    ),
                                    h(
                                        "div",
                                        { class: "dashboard-sidebar__role-change" },
                                        [
                                            h(
                                                "i",
                                                { class: "icon-refresh" }
                                            ),
                                            h(
                                                "span",
                                                "切换为画师"
                                            )
                                        ]
                                    )
                                ]
                            )
                        ]
                    ),
                    h(
                        "section",
                        { class: "dashboard-sidebar__action-limit is-employer" },
                        h(
                            "div",
                            { class: "dashboard-sidebar__action-limit-name" },
                        )
                    ),
                    h(
                        "section",
                        { class: "dashboard-sidebar__tabs" },
                        h(
                            ElTabs,
                            { "tab-position": "left" },
                            [
                                h(
                                    ElTabPane,
                                    {
                                        label: h(
                                            "div",
                                            [
                                                h("i", { class: "icon-my-project" }),
                                                "我的企划"
                                            ]
                                        )
                                    }
                                )
                            ]
                        )
                    )
                ]
            )
        }
    }
    const app = Vue.createApp({
        components: { SideBarMenu },
        setup() {
            return () => [
                h(SideBarMenu)
            ]
        }
    })
    const { ElTabs, ElTabPane, ElForm, ElFormItem, ElInput, ElButton, ElSelect, ElOption } = ElementPlus;
    app.use(ElTabs);
    app.use(ElTabPane);
    app.use(ElForm);
    app.use(ElFormItem);
    app.use(ElInput);
    app.use(ElButton);
    app.use(ElSelect);
    app.use(ElOption);
    app.use(ElementPlus);
    app.mount('.dashboard-sidebar__wrapper');
})